<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
		<title>个人资料</title>
		<style media="screen">
		    ::-webkit-scrollbar {
		        width: 0;
		        height: 0;
		    }
	    </style>
	    <script>
		    var html = document.getElementsByTagName('html')[0];
		    html.style.fontSize = html.clientWidth / 10.8 + "px";
		    addEventListener("resize", function() {
		        html.style.fontSize = html.clientWidth / 10.8 + "px";
		    }, false);
	    </script>
		<link rel="stylesheet" type="text/css" href="reset.css"/>
		<link rel="stylesheet" type="text/css" href="mine.css"/>
	</head>
	<body>
		<div id="wrapper">
			<div class="personal_data">
				<ul>					
					<li id="xingming">
						<span>姓名</span>
						<input type="text" id="change_name"placeholder="请输入姓名" autofocus="autofocus"/>
					</li>
					
					<li id="xingbie">
						<span>性别</span>
						<!--<select name="SEX" style="color: #0a0b0c; border: 0px solid black; " id="sex">
						<option value="0" <c:if test="${user.SEX==0}">selected="selected" </c:if>>男</option>
						<option value="1" <c:if test="${user.SEX!=0}">selected="selected" </c:if>>女</option>
					</select>-->
						<input name="SEX" id="sexH" value="${user.SEX}" type="hidden"/>
						<input id="sex" style="color: #0a0b0c;" value="" onclick="change(); " readonly/>
					</li>
					<li id="sfzh">
						<span>身份证号</span>
						<input type="text" id="change_name"placeholder="请输入身份证号"/>
					</li>
					<li id="kahao"><span>手机号</span><span>18867890980</span></li>
					<li id="erweima"><span>会员级别</span><span>鸟巢金卡</span></li>	
					<li id="jifen"><span>会员积分</span><span>1234</span></li>
				</ul>
				<button id="change_data">保存</button>
			</div>
			<footer>技术支持：<a href="http://www.bjhengye.net">北京恒业创达科技有限公司 </a></footer>
		</div>
	</body>
	<div id="selectSex" style="display:none;width: 100%;height: 100%;position: absolute;left: 0px;top: 0px;filter:alpha(opacity:80);z-index: 9999;background-color: rgba(0, 0, 0, 0.5);">
		<div style="width: 100%;height: 70%; opacity:0;" onclick="change();"></div>
		<div style="width: 100%;height: 30%; background-color: white; " >
			<div style="width: 100%;height: 50%; border-bottom: 1px solid #CCCCCC;" onclick="changeMan();">
				<p style="color:black;font-size: 0.9em;padding:7% 0;" align="center">男</p>
			</div>
			<div style="width: 100%;height: 50%; " onclick="changeWoMan();">
				<p style="color:black;font-size: 0.9em;padding:7% 0;" align="center">女</p>
			</div>
		</div>
	</div>
	<script src="query-1.7.2.js" type="text/javascript"></script>
	<script>
		function changeMan() {
			$("#sexH").val("0");
			$("#sex").val("男");
			$("#selectSex").hide();
		}
		function changeWoMan() {
			$("#sexH").val("1");
			$("#sex").val("女");
			$("#selectSex").hide();
		}
		function change() {
			$("#selectSex").toggle();
		}
	</script>
</html>

